<template>
	<view class="user" :class="[isDark?'dark':'', $store.state.AppStyle]" :style="{'background-color':isDark?'#1c1c1c':'#f6f6f6','min-height':isDark?'100vh':'auto'}">
		<view class="header" :style="[{height:CustomBar + 'px'}]">
			<view class="cu-bar" :class="isDark?'dark':'bg-white'" :style="{'height': CustomBar + 'px','padding-top':StatusBar + 'px','background-color':isDark?'#1c1c1c':'#ffffff'}">
				<view class="action" @tap="back">
					<text class="cuIcon-back" :style="{'color':isDark?'#ffffff':'#333333'}"></text>
				</view>
				<view class="content text-bold" :style="[{top:StatusBar + 'px'}, {'color':isDark?'#ffffff':'#333333'}]">
					{{$t('manage.grantbluev.bluevgrant')}}
				</view>
				<view class="action" @tap="grantBlueV">
					<button class="cu-btn round bg-blue">{{$t('global.confirm')}}</button>
				</view>
			</view>
		</view>
		<view :style="[{padding:NavBar + 'px 10px 0px 10px'}]"></view>
		
		<form>
			<view class="cu-form-group margin-top" :class="isDark?'dark':''" :style="{'background-color':isDark?'#2a2a2a':'#ffffff', 'border-bottom':isDark?'1px solid #444':'1px solid #f0f0f0'}">
				<view class="title" :style="{'color':isDark?'#ffffff':'#333333'}">{{$t('global.userid')}}</view>
				<input placeholder="$t('global.plsuserid')" name="input" type="number" v-model="targetUid" :placeholder-style="isDark?'color:#999':'color:#999'" :style="{'color':isDark?'#ffffff':'#333333'}"/>
				<view class="action">
					<text class="text-blue" @tap="toUser" v-if="pageType==0">{{$t('global.selectuser')}}</text>
				</view>
			</view>
			<view class="cu-form-group" :class="isDark?'dark':''" :style="{'background-color':isDark?'#2a2a2a':'#ffffff', 'border-bottom':isDark?'1px solid #444':'1px solid #f0f0f0'}">
				<view class="title" :style="{'color':isDark?'#ffffff':'#333333'}">{{$t('manage.grantbluev.authtitle')}}</view>
				<input placeholder="$t('manage.grantbluev.plsauthtitle')" name="input" v-model="name" :placeholder-style="isDark?'color:#999':'color:#999'" :style="{'color':isDark?'#ffffff':'#333333'}"/>
			</view>
		</form>
		<!--  #ifdef MP -->
		<view class="post-update bg-blue" @tap="grantBlueV">
			<text class="cuIcon-upload"></text>
		</view>
		<!--  #endif -->
	</view>
</template>

<script>
	import { localStorage } from '../../js_sdk/mp-storage/mp-storage/index.js'
	import darkModeMixin from '@/utils/darkModeMixin.js'
	export default {
		mixins: [darkModeMixin],
		data() {
			return {
				StatusBar: this.StatusBar,
				CustomBar: this.CustomBar,
				NavBar:this.StatusBar +  this.CustomBar,
				AppStyle:this.$store.state.AppStyle,
				
				targetUid: "",
				name: "",
				entname: "",
				regno: "",
				idcard: "",
				
				token: '',
				pageType: 0,
			}
		},
		onPullDownRefresh(){
			var that = this;
			
		},
		onHide() {
			localStorage.removeItem('getuid')
		},
		onShow(){
			var that = this;
			// #ifdef APP-PLUS
			//plus.navigator.setStatusBarStyle("dark")
			// #endif
			if(localStorage.getItem('getuid')){
				that.targetUid = localStorage.getItem('getuid');
			}
		},
		onLoad(res) {
			var that = this;
			// #ifdef APP-PLUS || MP
			that.NavBar = that.CustomBar;
			// #endif
			if(res.uid){
				that.pageType = 1;
				that.targetUid = res.uid;
			}
		},
		methods: {
			back(){
				uni.navigateBack({
					delta: 1
				});
			},
			grantBlueV() {
				var that = this;
				// 验证必填字段
				if(that.targetUid == ""){
					uni.showToast({
					    title: that.$t('manage.grantbluev.plsenteruserid'),
						icon:'none',
						duration: 1000
					});
					return false;
				}
				if(that.name == ""){
					uni.showToast({
					    title: that.$t('manage.grantbluev.plsauthtitle'),
						icon:'none',
						duration: 1000
					});
					return false;
				}
				var token = "";
				if(localStorage.getItem('userinfo')){
					var userInfo = JSON.parse(localStorage.getItem('userinfo'));
					token = userInfo.token;
				}
				// 构建params对象
				var params = {
					name: that.name,
					regno: that.regno,
					entname: that.entname,
					idcard: that.idcard
				};
				var data = {
					targetUid: that.targetUid,
					params: JSON.stringify(params),
					token: token
				};
				uni.showModal({
					title: that.$t('manage.grantbluev.suregrantbluevauth'),
					content: that.$t('global.userid') + ` : ${that.targetUid}\n` + that.$t('manage.grantbluev.authtitle') + `: ${that.name}`,
					success: function (res) {
						if (res.confirm) {
							uni.showLoading({
								title: that.$t('manage.grantbluev.awardedin') + '...'
							});
							that.$Net.request({
								url: that.$API.adminAddCompany(),
								data: data,
								header: {
									'Content-Type': 'application/x-www-form-urlencoded'
								},
								method: "get",
								dataType: 'json',
								success: function(res) {
									setTimeout(function () {
										uni.hideLoading();
									}, 1000);
									uni.showToast({
										title: res.data.msg,
										icon: 'none'
									});
									if(res.data.code == 1){
										localStorage.removeItem('getuid');
										// 清空表单
										that.targetUid = "";
										that.name = "";
										that.entname = "";
										that.regno = "";
										that.idcard = "";
										setTimeout(function () {
											that.back();
										}, 1500);
									}
								},
								fail: function(res) {
									setTimeout(function () {
										uni.hideLoading();
									}, 1000);
									uni.showToast({
										title: that.$t('common.networkfail'),
										icon: 'none'
									});
								}
							});
						}
					}
				});
			},
			toUser(){
				uni.navigateTo({
				    url: '/pages/manage/users?type=get'
				});
			}
		}
	}
</script>

<style scoped>
	.cu-form-group {
		transition: background-color 0.3s ease;
	}
	
	.cu-form-group.dark {
		background-color: #2a2a2a;
	}
	
	.cu-form-group .title {
		width: 200rpx;
		font-size: 30rpx;
	}
	
	.cu-form-group input {
		flex: 1;
		font-size: 30rpx;
		padding: 0 20rpx;
	}
</style> 